import { Button, Radio } from 'antd';
import type { RadioChangeEvent } from 'antd';
import TextArea from 'antd/lib/input/TextArea';
import styles from './index.module.less'
interface FCprops {
    onOk: () => void,
    id:number | string
}
import React, { useState } from 'react';

const options = [
    { label: '含有不良信息', value: 1 },
    { label: '含有非法广告', value: 2 },
    { label: '恶意言论', value: 3 },
    { label: '虚假消息', value: 4 },
    { label: '恶意引战', value: 5 },
    { label: '有悖核心价值观', value: 6 },
    { label: '不良引导', value: 7 },
    { label: '抄袭', value: 8 },
]

const Complain: React.FC<FCprops> = ({ onOk, id }) => {

    const [option, setOption] = useState<number>(1);
    const onRadioChange = ({ target: { value } }: RadioChangeEvent) => {
        setOption(value);
    };

    const [text, setText] = useState<string>("");
    const onTextChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
        setText(e.target.value);
    };

    const handleSubmit = () => {
        console.log(option, text, id);
        onOk()
    }

    return (
        <div className={styles['container']}>
            <Radio.Group
                options={options}
                value={option}
                onChange={onRadioChange}
            />
            <TextArea
                className={styles['text']}
                rows={4}
                placeholder='输入举报理由'
                onChange={onTextChange}
                value={text}
            />
            <Button className={styles['btn']} onClick={handleSubmit}>举报</Button>
        </div>
    )
}
export default Complain;